<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div {
            font-size: 50px;
            /* 可以设置行高和高度一样的值，使用单行文字在一个元素中垂直居中 */
            height: 200px;

            line-height: 200px;
            /* 行高（line height）
                  --行高指的是文字占的实际高度
                  --通过line-height来设置行高
                         行高可以指定一个大小
                         也可以指定一个整数，行高将会是字体的指定的倍数
                         
                行高经常来设置字体为的行间距
                行间距=行高-字体大小
                字体框
                   字体框就是字体存在的格子，设置font-size实际就是设置字体的高度
                行高会在字体框的上下平均分配
            */
            border: 1px red solid;

        }

        span {
            /* font:
            可以设置字体相关的所有属性
             语法
                font:bold italic字体大小/行高 字体族
                字体大小 字体族必须写
                行高可以省略不写，不写则使用默认值
                bold---加粗 italic---斜体

            ; */
  
            /* font-size: 50px;
            font-family: Georgia, 'Times New Roman', Times, serif; */
            /* font: 50px 'Times New Roman', Times, serif; */
            font: 50px/2 'Times New Roman', Times, serif;

            /* font-weight: bold;自重   字体加粗
                可选值
                normal 默认值，不加粗
                bold 加粗
                100-900  九个级别（没什么用）
                */
                /* font-style: 字体风格
                normal 正常
                italic 斜体         
                */
        }
    </style>
</head>

<body>
    <div>随便写点字，ok</div>
    <div>随便写点字，ok</div>
    <div>随便写点字，ok</div>
    <div>随便写点字，ok</div>
    <span>随便加一，yiyi</span>
</body>

</html>